<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="referrer" content="no-referrer" />
    <meta http-equiv="X-Frame-Options" content="SAMEORIGIN" />
    <meta http-equiv="X-Content-Type-Options" content="nosniff" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="shortcut icon" id="tab-favicon" href="favicon.png" />
    <title id="tab-title">Home</title>
    <link rel="stylesheet" id="global" href="/assets/css/global.css?v=6" />
    <link rel="stylesheet" href="/assets/css/container.css?v=2" />
    <link rel="stylesheet" href="/assets/css/nav.css?v=2" />
    <link rel="stylesheet" href="/assets/css/settings.css?v=4" />
    <script src="https://kit.fontawesome.com/1237c86ba0.js" crossorigin="anonymous"></script>
  </head>
  <body>
    <div class="fixed-nav-bar"></div>
    <div class="main">
      <div class="popup">
        <h3>Theme Creator</h3>
        <button class="export" id="export-theme">Export CSS</button>
        <button class="import" id="import-theme-button">Import CSS</button>
        <p>Change the background image</p>
        <input type="text" id="background-input" placeholder="Enter image URL" />
        <button class="green" id="save-button">Save Image</button>
        <button id="upload-button">Upload Image</button>
        <button id="black-button">Black Background</button>
        <button id="white-button">White Background</button>
        <button class="red" id="reset-button">Reset</button>
        <p>Change the background color</p>
        <input type="text" class="input-small" id="background-color-input" />
        <p>Change the searchbar/input color</p>
        <input type="text" class="input-small" id="input-color-input" />
        <p>Change the app card color</p>
        <input type="text" class="input-small" id="app-card-color-input" />
        <p>Change the settings card color</p>
        <input type="text" class="input-small" id="settings-card-color-input" />
        <p>Change the color of buttons</p>
        <input type="text" class="input-small" id="button-color-input" />
        <p>Change the accent color of tabs</p>
        <input type="text" class="input-small" id="tab-accent-color-input" />
        <p>Change the background color of turned on sliders</p>
        <input type="text" class="input-small" id="slider-active-color-input" />
        <p>Change the background color of turned off sliders</p>
        <input type="text" class="input-small" id="slider-inactive-color-input" />
        <p>Change the color of our icon on the nav bar</p>
        <button id="white-logo">White Logo</button>
        <button id="black-logo">Black Logo</button>
        <p>Change the primary color of text (Default Color: White)</p>
        <input type="text" class="input-small" id="primary-text-color-input" />
        <p>Change the color of dark text (Default Color: Gray)</p>
        <input type="text" class="input-small" id="dark-text-color-input" />
        <p>Change the color of placeholder text (Default Color: Light Gray)</p>
        <input type="text" class="input-small" id="placeholder-text-color-input" />
        <button onclick="ClosePopup()" id="save-theme">Save Theme</button>
      </div>
      <div class="settings-container">
        <div class="settings-card">
          <h3>About:Blank</h3>
          <p>
            Cloak the site in an about:blank page and toggle about:blank on startup (enabled by
            default)
          </p>
          <div id="ab-settings">
            <div id="ab-settings-container">
              <label class="switch">
                <input
                  type="checkbox"
                  id="ab-settings-switch"
                  class="slider-checkbox"
                  onchange="toggleAB()" />
                <span class="slider-round"></span>
              </label>
            </div>
            <button onclick="AB()" class="key-button">Open Popup</button>
          </div>
        </div>
        <div class="settings-card">
          <h3>Set Panic Key</h3>
          <p>
            Quick open another site with one press. Used for redirects when about:blank is
            opened. For multiple key strokes separate them with a comma. Ex. "A,B,C"
          </p>
          <input
            type="text"
            id="eventKeyInput"
            placeholder="Panic Keys (comma separated)"
            class="key-form" />
          <input class="key-form" placeholder="Panic Link" type="text" id="linkInput" value />
          <button class="key-button" value="Save" onclick="saveEventKey()">Save</button>
        </div>
        <div class="settings-card">
          <h3>Tab Cloaker</h3>
          <p>Change the title and icon of the page.</p>
          <select id="dropdown" onchange="handleDropdownChange(this)">
            <option value="Classroom">Default</option>
            <option value="Clever">Clever</option>
            <option value="Canvas">Canvas</option>
            <option value="Edpuzzle">Edpuzzle</option>
            <option value="Google">Google</option>
            <option value="Google Meet">Google Meet</option>
            <option value="Classroom">Google Classroom</option>
            <option value="Drive">Google Drive</option>
            <option value="Google Docs">Google Docs</option>
            <option value="Google Slides">Google Slides</option>
            <option value="Gmail">Gmail</option>
            <option value="Khan">Khan Academy</option>
            <option value="Campus">Infinite Campus</option>
            <option value="IXL">IXL</option>
            <option value="LinkIt">LinkIt!</option>
            <option value="Schoology">Schoology</option>
            <option value="i-Ready Math">i-Ready Math</option>
            <option value="i-Ready Reading">i-Ready Reading</option>
            <option value="ClassLink Login">ClassLink Login</option>
            <option value="Wikipedia">Wikipedia</option>
            <option value="Britannica">Britannica</option>
            <option value="Ducksters">Ducksters</option>
            <option value="Minga">Minga</option>
            <option value="i-Ready Learning Games">i-Ready Learning Games</option>
            <option value="NoRedInk Home">NoRedInk Home</option>
            <option value="Newsela Binder">Newsela Binder</option>
            <option value="Newsela Assignments">Newsela Assignments</option>
            <option value="Newsela Home">Newsela Home</option>
            <option value="PowerSchool Sign In">PowerSchool Sign In</option>
            <option value="PowerSchool Grades and Attendance">
              PowerSchool Grades and Attendance
            </option>
            <option value="PowerSchool Teacher Comments">PowerSchool Teacher Comments</option>
            <option value="PowerSchool Standards Grades">PowerSchool Standards Grades</option>
            <option value="PowerSchool Attendance">PowerSchool Attendance</option>
            <option value="Nearpod">Nearpod</option>
            <option value="StudentVUE">StudentVUE</option>
            <option value="Quizlet Home">Quizlet Home</option>
            <option value="Google Forms Locked Mode">Google Forms - Locked Mode</option>
            <option value="DeltaMath">DeltaMath</option>
            <option value="Kami">Kami</option>
            <option value="GoGuardian Admin Restricted">GoGuardian Admin Block</option>
            <option value="GoGuardian Teacher Block">GoGuardian Teacher Block</option>
            <option value="World History Encyclopedia">World History Encyclopedia</option>
            <option value="Big Ideas Math">Big Ideas Math</option>
            <option value="Big Ideas Math Assignment Player">
              Big Ideas Math Assignment Player
            </option>
            <option value="Savvas Realize">Savvas Realize</option>
            <option value="SmartPass">SmartPass</option>
            <option value="World Book Online - Super Home">
              World Book Online (Super Home)
            </option>
            <option value="World Book Online - Student">World Book Online (Student)</option>
            <option value="World Book Online - Timelines">
              World Book Online (Timelines)
            </option>
            <option value="Naviance">Naviance Student</option>
            <option value="PBS Learning Media">PBS Learning Media</option>
            <option value="PBS Learning Media Student Home">
              PBS Learning Media Student Home
            </option>
            <option value="Dictionary">Dictionary.com</option>
            <option value="Thesaurus">Thesaurus.com</option>
          </select>
          <div>
            <input
              class="key-form"
              type="text"
              id="icon"
              placeholder="Change Tab Icon"
              name="icon" />
            <input
              class="key-form"
              type="text"
              id="name"
              name="name"
              placeholder="Change Tab Name" />
          </div>
          <div id="buttonLayer">
            <button
              class="key-button"
              value="Save"
              onclick="CustomIcon(); CustomName(); redirectToMainDomain();">
              Save
            </button>
            <button
              class="key-button"
              value="Reset"
              onclick="ResetCustomCloak(); redirectToMainDomain();">
              Reset Cloak
            </button>
          </div>
        </div>
        <div class="settings-card">
          <h3>Customization</h3>
          <p>
            Change the theme, create your own custom theme, or just change the background
            image.
          </p>
          <p>
            Custom Themes are currently broken, we are working to fix this as soon as possible
          </p>
          <button class="key-button" value="Save" onclick="Popup()" style="width: 100%">
            Create Custom Theme
          </button>
        </div>
        <div class="settings-card">
          <h3>Search Engine</h3>
          <p>Change the search engine when searching.</p>
          <select title="engine" id="engine" onchange="EngineChange(this)">
            <option value="Google">Google (Default)</option>
            <option value="Bing">Bing</option>
            <option value="DuckDuckGo">DuckDuckGo</option>
            <option value="Qwant">Qwant</option>
            <option value="Startpage">Startpage</option>
            <option value="SearchEncrypt">SearchEncrypt</option>
            <option value="Ecosia">Ecosia</option>
          </select>
          <input
            class="key-form"
            type="text"
            id="engine-form"
            placeholder="Change Search Engine"
            name="engine" />
          <button class="key-button" value="Save" onclick="SaveEngine();">Save</button>
        </div>
        <div class="settings-card">
          <h3>Choose your <an>Pro</an>xy</h3>
          <p>
            Ultra<an>vio</an>let is the main <an>pro</an>xy, but Dynamic is faster and supports
            more sites. (Dynamic is still in beta, so expect some bugs.)
          </p>
          <select id="pChange">
            <option value="uv">Ultraviolet (Default)</option>
            <option value="dy">Dynamic (Doesn't work in about:blank)</option>
          </select>
        </div>
        <div class="settings-card">
          <h3>Particles</h3>
          <p>Add the particles that are from the previous version to the new site.</p>
          <label class="switch">
            <input type="checkbox" class="slider-checkbox" id="2" />
            <span class="slider-round"></span>
          </label>
        </div>
        <div class="settings-card">
          <h3>Themes!</h3>
          <p>Pick from a variety of themes to customize your experience.</p>
          <select
            placeholder="Solid Color Themes"
            id="dropdown"
            class="td"
            onchange="themeChange(this)">
            <option disabled selected>Solid Color Themes</option>
            <option value="d">Default</option>
            <option value="Inverted">Inverted</option>
            <option value="sky">Sky</option>
            <option disabled selected>Catppuccin Themes</option>
            <option value="catppuccinMocha">Mocha</option>
            <option value="catppuccinMacchiato">Macchiato</option>
            <option value="catppuccinFrappe">Frappe</option>
            <option value="catppuccinLatte">Latte</option>
            <option disabled selected>Custom Themes</option>
          </select>
        </div>
        <div class="settings-card">
          <h3>Information</h3>
          <p>Version: v5.2.4</p>
          <p id="last-updated">Last Updated: June 19th, 2024</p>
          <p>
            Questions? Join our
            <a href="https://discord.gg/interstellar">Discord community</a>, email us at
            <a href="mailto:hello@gointerstellar.app">hello@gointerstellar.app</a>, or
            <a href="https://docs.gointerstellar.app/faq">check our FAQ</a>!
          </p>
          <p>
            By using Interstellar services, you confirm you have read and agreed to the terms listed in our <a href="/tos">Terms of Service and Privacy Policy</a>.
          </p>
        </div>
      </div>
    </div>
    <script src="/assets/js/main.js?v=90"></script>
    <script src="/assets/js/settings.js?v=8"></script>
    <!-- DO NOT REMOVE-->
    <script async src="https://www.googletagmanager.com/gtag/js?id=G-WKJQ5QHQTJ"></script>
    <script>
      window.dataLayer = window.dataLayer || []
      function gtag() {
        dataLayer.push(arguments)
      }
      gtag("js", new Date())

      gtag("config", "G-WKJQ5QHQTJ")
    </script>
    <!-- DO NOT REMOVE-->
    <div>
      <script
        type="text/javascript"
        src="//alleygoat.com/5e/6b/27/5e6b2776400180cc548a7dfd8ab3f717.js"></script>
    </div>
  </body>
</html>
